<template>
  <div class="commetItem u-p-20">
    <div class="head u-flex u-col-center u-row-between">
      <div class="u-flex u-col-center">
        <u-avatar  :src="commentItem.headimgurl" size="50" mode="widthFix"  />
        <div>
          <p class="u-m-l-20 userName">{{commentItem.user_name?commentItem.user_name:$t('匿名')}}</p>
        </div>
      </div>
      <span class="time">{{commentItem.createtime.slice(0,10) }}</span>
    </div>
    <u-rate :value="commentItem.goods_star" active-color="#ffa468" disabled></u-rate>
    <p class="content">{{commentItem.content}}</p>
    <div class="imgWrap">
      <block v-for="(img, index2) in commentItem.imgurl" :key="index2">
        <u-image :src="img" mode="widthFix" @click="$utils.previewImgs(commentItem.imgurl,index2)"
                 width="240" height="240" border-radius="8" />
      </block>
    </div>
  </div>
</template>

<script>
export default {
  name: "commentItem",
  props:{
    commentItem:{
      type:Object,
      default:{}
    }
  },
  methods: {

  }
}
</script>

<style lang="scss" scoped>
.commetItem{
  background-color:#fff;
  margin-top:20upx;
  border-radius:16upx;
  .head{
    margin-bottom: 20upx;
  }
  .content{
    margin-top:20upx;
  }
  .userName{
    font-weight:500;
    color:#333
  }
  .time{
    font-size:24upx;
    color:#999
  }
}
</style>